import 'package:safetymonitor/app/core/core.dart';
import 'package:safetymonitor/app/core/ext/ext.dart';
import 'package:safetymonitor/app/data/common/choice_bean.dart';
import 'package:safetymonitor/generated/assets.dart';

///按钮格式的选择框样式
///@Param [dataList] 选择器数据
///@Param [onConfirm] 确认回调
///@Param [isRadio] 是否单选
///@Param [isEnabled] 是否可编辑
/// demo:
/// ``` dart
/// CustomSelectButtonPage<T>(
///   dataList: [],
///   onConfirm: (List<T> value){
///   },
/// );
/// ```
class CustomSelectButtonPage<T extends ChoiceBean> extends StatefulWidget {
  const CustomSelectButtonPage({
    required this.dataList,
    required this.onConfirm,
    super.key,
    this.isRadio = true,
    this.isEnabled = true,
    this.wrapAlignment,
  });

  final List<T> dataList;
  final Function(List<T> value) onConfirm;
  final bool isRadio;
  final bool isEnabled;
  final WrapAlignment? wrapAlignment;

  @override
  State<CustomSelectButtonPage<T>> createState() => _CustomSelectButtonPageState<T>();
}

class _CustomSelectButtonPageState<T extends ChoiceBean> extends State<CustomSelectButtonPage<T>> {
  //按钮点击事件
  void _onTap(T item) {
    if (!widget.isEnabled) {
      return;
    }
    //单选
    if (widget.isRadio) {
      for (var element in widget.dataList) {
        element.setIsChecked(false);
      }
      item.setIsChecked(true);
      //返回选中的数据
      widget.onConfirm([item]);
      setState(() {});
    } else {
      //多选
      item.setIsChecked(!item.getIsChecked());
      //遍历选中的数据
      final List<T> checkedList = [];
      for (var element in widget.dataList) {
        if (element.getIsChecked()) {
          checkedList.add(element);
        }
      }
      //返回选中的数据
      widget.onConfirm(checkedList);
      setState(() {});
    }
  }

  @override
  Widget build(BuildContext context) {
    return Wrap(
      alignment: widget.wrapAlignment ?? WrapAlignment.start,
      spacing: 50.w,
      // runSpacing: 10.w,
      children: widget.dataList
          .map((item) => Container(
                  padding: EdgeInsets.symmetric(vertical: 20.w),
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      item.getIsChecked()
                          ? SvgPicture.asset(
                              Assets.svgIconSelect,
                              height: 16.w,
                              width: 16.w,
                            )
                          : SvgPicture.asset(
                              Assets.svgIconUnSelect,
                              height: 16.w,
                              width: 16.w,
                            ),
                      AppGaps.hGap4,
                      Text(
                        item.getShowName(),
                        style: TextStyle(
                          height: 1.2,
                          color: const Color(0xff8D95A3),
                          fontSize: 14.sp,
                          fontWeight: FontWeight.w400,
                        ),
                      )
                    ],
                  )).clickOnce(() {
                _onTap(item);
              }))
          .toList(),
    );
  }
}
